<!DOCTYPE html>
            <html lang="zh">

            <head>
                <meta charset="UTF-8">
                <meta content="Javascript最热前端框架,一些经常用到的函数封装（转载）爱尚博客,www.aijiumai.cn,aijiumai.cn,前端趋势,微信小程序制作,小程序教程,前端怎么做app,app制作,网站开发,靠谱的网站开发,app开发,小程序开发,小程序开发多少钱,app开发多少钱,网站开发多少钱"
                    name="Keywords">
                <meta name="description" content="一些经常用到的函数封装（转载）-爱尚博客-让前端萌新少走弯路的博客！" />
                <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
                <title>一些经常用到的函数封装（转载）-爱尚博客-爱尚前端-www.aijiumai.cn</title>
                <link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet">
                <link rel="stylesheet" href="https://cdn.bootcss.com/material-design-icons/3.0.1/iconfont/material-icons.css">
                <script src="../../common/public.js"></script>
                <link rel="stylesheet" href="../../common/styles/atom-one-dark.css">
                <link rel="stylesheet" href="../../common/m.css">
                <link rel="stylesheet" href="../../assets/css/item.css">
            </head>

            <body>
            <div class="box" v-cloak>
            <!-- 导航 -->
            <header>
                <div class="logo">爱尚博客</div>
                <div class="navs">
                    <a :href="item.url" v-for="(item,index) in nav" :key="item.Id" v-cloak>{{item.name}}</a>
                </div>
                <!-- 小屏幕nav -->
                <mu-menu cover placement="bottom-end" :open.sync="open">
                    <mu-button icon>
                        <mu-icon value="menu"></mu-icon>
                    </mu-button>
                    <mu-list slot="content">
                    <mu-list-item button v-for="(item,index) in nav" :key="item.Id" :href="item.url">
                        <mu-list-item-title>
                            {{item.name}}
                        </mu-list-item-title>
                    </mu-list-item>
                    </mu-list>
                </mu-menu>
                <!-- 小屏幕nav -->
            </header>
            <!-- 导航 -->
            <!-- 主体 -->
            <article>
                <section>
                    <mu-card>
                        <!-- <mu-card-media title="Image Title" sub-title="Image Sub Title">
                        </mu-card-media> -->
                        <mu-card-title title="一些经常用到的函数封装（转载）" sub-title="2019-07-22 11:23:37"></mu-card-title>
                        <mu-card-text>
                            <p>一些经常用到的函数封装</p>
<pre><code class="lang-javascript">// 1.输入一个值，返回其数据类型
function type(para) {
    return Object.prototype.toString.call(para)
}


// 2.数组去重
function unique1(arr) {
    return [...new Set(arr)]
}

function unique2(arr) {
    var obj = {};
    return arr.filter(ele =&gt; {
        if (!obj[ele]) {
            obj[ele] = true;
            return true;
        }
    })
}

function unique3(arr) {
    var result = [];
    arr.forEach(ele =&gt; {
        if (result.indexOf(ele) == -1) {
            result.push(ele)
        }
    })
    return result;
}


//3.字符串去重 
String.prototype.unique = function () {
    var obj = {},
        str = &#39;&#39;,
        len = this.length;
    for (var i = 0; i &lt; len; i++) {
        if (!obj[this[i]]) {
            str += this[i];
            obj[this[i]] = true;
        }
    }
    return str;
}


// 4.去除连续的字符串 
function uniq(str) {
    return str.replace(/(\w)\1+/g, &#39;$1&#39;)
}


//4.深克隆（深克隆不考虑函数）
function deepClone(obj, result) {
    var result = result || {};
    for (var prop in obj) {
        if (obj.hasOwnProperty(prop)) {
            if (typeof obj[prop] == &#39;object&#39; &amp;&amp; obj[prop] !== null) {
                // 引用值(obj/array)且不为null
                if (Object.prototype.toString.call(obj[prop]) == &#39;[object Object]&#39;) {
                    // 对象
                    result[prop] = {};
                } else {
                    // 数组
                    result[prop] = [];
                }
                deepClone(obj[prop], result[prop])

            } else {
                // 原始值或func
                result[prop] = obj[prop]
            }
        }
    }
    return result;
}

// 深浅克隆是针对引用值
function deepClone(target) {
    if (typeof (target) !== &#39;object&#39;) {
        return target;
    }
    var result;
    if (Object.prototype.toString.call(target) == &#39;[object Array]&#39;) {
        // 数组
        result = []
    } else {
        // 对象
        result = {};
    }
    for (var prop in target) {
        if (target.hasOwnProperty(prop)) {
            result[prop] = deepClone(target[prop])
        }
    }
    return result;
}
// 无法复制函数
var o1 = JSON.parse(JSON.stringify(obj1));

// 5.reverse底层原理和扩展
// 改变原数组
Array.prototype.myReverse = function () {
    var len = this.length;
    for (var i = 0; i &lt; len; i++) {
        var temp = this[i];
        this[i] = this[len - 1 - i];
        this[len - 1 - i] = temp;
    }
    return this;
}

//6. 圣杯模式的继承
function inherit(Target, Origin) {
    function F() {};
    F.prototype = Origin.prototype;
    Target.prototype = new F();
    Target.prototype.constructor = Target;
    // 最终的原型指向
    Target.prop.uber = Origin.prototype;
}

//7. 找出字符串中第一次只出现一次的字母
String.prototype.firstAppear = function () {
    var obj = {},
        len = this.length;
    for (var i = 0; i &lt; len; i++) {
        if (obj[this[i]]) {
            obj[this[i]]++;
        } else {
            obj[this[i]] = 1;
        }
    }

    for (var prop in obj) {
        if (obj[prop] == 1) {
            return prop;
        }
    }
}

//8. 找元素的第n级父元素
function parents(ele, n) {
    while (ele &amp;&amp; n) {
        ele = ele.parentElement ? ele.parentElement : ele.parentNode;
        n--;
    }
    return ele;
}

//9. 返回元素的第n个兄弟节点
function retSibling(e, n) {
    while (e &amp;&amp; n) {
        if (n &gt; 0) {
            if (e.nextElementSibling) {
                e = e.nextElementSibling;
            } else {
                for (e = e.nextSibling; e &amp;&amp; e.nodeType !== 1; e = e.nextSibling);
            }
            n--;
        } else {
            if (e.previousElementSibling) {
                e = e.previousElementSibling;
            } else {
                for (e = e.previousElementSibling; e &amp;&amp; e.nodeType !== 1; e = e.previousElementSibling);
            }
            n++;
        }
    }
    return e;
}

//10. 封装mychildren，解决浏览器的兼容问题
function myChildren(e) {
    var children = e.childNodes,
        arr = [],
        len = children.length;
    for (var i = 0; i &lt; len; i++) {
        if (children[i].nodeType === 1) {
            arr.push(children[i])
        }
    }
    return arr;
}

// 11.判断元素有没有子元素
function hasChildren(e) {
    var children = e.childNodes,
        len = children.length;
    for (var i = 0; i &lt; len; i++) {
        if (children[i].nodeType === 1) {
            return true;
        }
    }
    return false;
}

// 12.我一个元素插入到另一个元素的后面
Element.prototype.insertAfter = function (target, elen) {
    var nextElen = elen.nextElenmentSibling;
    if (nextElen == null) {
        this.appendChild(target);
    } else {
        this.insertBefore(target, nextElen);
    }
}

//   13.返回当前的时间（年月日时分秒）
function getDateTime() {
    var date = new Date(),
        year = date.getFullYear(),
        month = date.getMonth() + 1,
        day = date.getDate(),
        hour = date.getHours() + 1,
        minute = date.getMinutes(),
        second = date.getSeconds();

    month = checkTime(month);
    day = checkTime(day);
    hour = checkTime(hour);
    minute = checkTime(minute);
    second = checkTime(second);

    function checkTime(i) {
        if (i &lt; 10) {
            i = &quot;0&quot; + i;
        }
        return i;
    }
    return &quot;&quot; + year + &quot;年&quot; + month + &quot;月&quot; + day + &quot;日&quot; + hour + &quot;时&quot; + minute + &quot;分&quot; + second + &quot;秒&quot;
}


//   14.获得滚动条的滚动距离
function getScrollOffset() {
    if (window.pageXOffset) {
        return {
            x: window.pageXOffset,
            y: window.pageYOffset
        }
    } else {
        return {
            x: document.body.scrollLeft + document.documentElement.scrollLeft,
            y: document.body.scrollTop + document.documentElement.scrollTop
        }
    }
}

//    15.获得视口的尺寸
function getViewportOffset() {
    if (window.innerWidth) {
        return {
            w: window.innerWidth,
            h: window.innerHeight
        }
    } else {
        // ie8及其以下
        if (document.compatMode === &quot;BackCompat&quot;) {
            // 怪异模式
            return {
                w: document.body.clientWidth,
                h: document.body.clientHeight
            }
        } else {
            // 标准模式
            return {
                w: document.documentElement.clientWidth,
                h: document.documentElement.clientHeight
            }
        }
    }
}

// 16.获取任一元素的任意属性
function getStyle(elem, prop) {
    return window.getComputedStyle ? window.getComputedStyle(elem, null)[prop] : elem.currentStyle[prop]
}

// 17.绑定事件的兼容代码
function addEvent(elem, type, handle) {
    if (elem.addEventListener) { //非ie和非ie9
        elem.addEventListener(type, handle, false);
    } else if (elem.attachEvent) { //ie6到ie8
        elem.attachEvent(&#39;on&#39; + type, function () {
            handle.call(elem);
        })
    } else {
        elem[&#39;on&#39; + type] = handle;
    }
}

// 18.解绑事件
function removeEvent(elem, type, handle) {
    if (elem.removeEventListener) { //非ie和非ie9
        elem.removeEventListener(type, handle, false);
    } else if (elem.detachEvent) { //ie6到ie8
        elem.detachEvent(&#39;on&#39; + type, handle);
    } else {
        elem[&#39;on&#39; + type] = null;
    }
}



//   19.取消冒泡的兼容代码
function stopBubble(e) {
    if (e &amp;&amp; e.stopPropagation) {
        e.stopPropagation();
    } else {
        window.event.cancelBubble = true;
    }
}

// 20.检验字符串是否是回文
function isPalina(str) {
    if (Object.prototype.toString.call(str) !== &#39;[object String]&#39;) {
        return false;
    }
    var len = str.length;
    for (var i = 0; i &lt; len / 2; i++) {
        if (str[i] != str[len - 1 - i]) {
            return false;
        }
    }
    return true;
}
//   21.检验字符串是否是回文
function isPalindrome(str) {
    str = str.replace(/\W/g, &#39;&#39;).toLowerCase();
    console.log(str)
    return (str == str.split(&#39;&#39;).reverse().join(&#39;&#39;))
}

// 22.兼容getElementsByClassName方法
Element.prototype.getElementsByClassName = Document.prototype.getElementsByClassName = function (_className) {
    var allDomArray = document.getElementsByTagName(&#39;*&#39;);
    var lastDomArray = [];

    function trimSpace(strClass) {
        var reg = /\s+/g;
        return strClass.replace(reg, &#39; &#39;).trim()
    }
    for (var i = 0; i &lt; allDomArray.length; i++) {
        var classArray = trimSpace(allDomArray[i].className).split(&#39; &#39;);
        for (var j = 0; j &lt; classArray.length; j++) {
            if (classArray[j] == _className) {
                lastDomArray.push(allDomArray[i]);
                break;
            }
        }
    }
    return lastDomArray;
}

// 23.运动函数
function animate(obj, json, callback) {
    clearInterval(obj.timer);
    var speed,
        current;
    obj.timer = setInterval(function () {
        var lock = true;
        for (var prop in json) {
            if (prop == &#39;opacity&#39;) {
                current = parseFloat(window.getComputedStyle(obj, null)[prop]) * 100;
            } else {
                current = parseInt(window.getComputedStyle(obj, null)[prop]);
            }

            speed = (json[prop] - current) / 7;
            speed = speed &gt; 0 ? Math.ceil(speed) : Math.floor(speed);

            if (prop == &#39;opacity&#39;) {
                obj.style[prop] = (current + speed) / 100;
            } else {
                obj.style[prop] = current + speed + &#39;px&#39;;
            }
            if (current != json[prop]) {
                lock = false;
            }
        }
        if (lock) {
            clearInterval(obj.timer);
            typeof callback == &#39;function&#39; ? callback() : &#39;&#39;;
        }
    }, 30)
}

// 24.弹性运动
function ElasticMovement(obj, target) {
    clearInterval(obj.timer);
    var iSpeed = 40,
        a, u = 0.8;
    obj.timer = setInterval(function () {
        a = (target - obj.offsetLeft) / 8;
        iSpeed = iSpeed + a;
        iSpeed = iSpeed * u;
        if (Math.abs(iSpeed) &lt;= 1 &amp;&amp; Math.abs(a) &lt;= 1) {
            console.log(&#39;over&#39;)
            clearInterval(obj.timer);
            obj.style.left = target + &#39;px&#39;;
        } else {
            obj.style.left = obj.offsetLeft + iSpeed + &#39;px&#39;;
        }
    }, 30);
}

// 25.封装自己的forEach方法
Array.prototype.myForEach = function (func, obj) {
    var len = this.length;
    var _this = arguments[1] ? arguments[1] : window;
    // var _this=arguments[1]||window;
    for (var i = 0; i &lt; len; i++) {
        func.call(_this, this[i], i, this)
    }
}

// 26.封装自己的filter方法
Array.prototype.myFilter = function (func, obj) {
    var len = this.length;
    var arr = [];
    var _this = arguments[1] || window;
    for (var i = 0; i &lt; len; i++) {
        func.call(_this, this[i], i, this) &amp;&amp; arr.push(this[i]);
    }
    return arr;
}

//  27.数组map方法
Array.prototype.myMap = function (func) {
    var arr = [];
    var len = this.length;
    var _this = arguments[1] || window;
    for (var i = 0; i &lt; len; i++) {
        arr.push(func.call(_this, this[i], i, this));
    }
    return arr;
}

// 28.数组every方法
Array.prototype.myEvery = function (func) {
    var flag = true;
    var len = this.length;
    var _this = arguments[1] || window;
    for (var i = 0; i &lt; len; i++) {
        if (func.apply(_this, [this[i], i, this]) == false) {
            flag = false;
            break;
        }
    }
    return flag;
}

// 29.数组reduce方法
Array.prototype.myReduce = function (func, initialValue) {
    var len = this.length,
        nextValue,
        i;
    if (!initialValue) {
        // 没有传第二个参数
        nextValue = this[0];
        i = 1;
    } else {
        // 传了第二个参数
        nextValue = initialValue;
        i = 0;
    }
    for (; i &lt; len; i++) {
        nextValue = func(nextValue, this[i], i, this);
    }
    return nextValue;
}


// 30.获取url中的参数   
function getWindonHref() {
    var sHref = window.location.href;
    var args = sHref.split(&#39;?&#39;);
    if (args[0] === sHref) {
        return &#39;&#39;;
    }
    var hrefarr = args[1].split(&#39;#&#39;)[0].split(&#39;&amp;&#39;);
    var obj = {};
    for (var i = 0; i &lt; hrefarr.length; i++) {
        hrefarr[i] = hrefarr[i].split(&#39;=&#39;);
        obj[hrefarr[i][0]] = hrefarr[i][1];
    }
    return obj;
}

//  31.数组排序
// 快排 [left] + min + [right]
function quickArr(arr) {
    if (arr.length &lt;= 1) {
        return arr;
    }
    var left = [],
        right = [];
    var pIndex = Math.floor(arr.length / 2);
    var p = arr.splice(pIndex, 1)[0];
    for (var i = 0; i &lt; arr.length; i++) {
        if (arr[i] &lt;= p) {
            left.push(arr[i]);
        } else {
            right.push(arr[i]);
        }
    }
    // 递归
    return quickArr(left).concat([p], quickArr(right));
}

// 冒泡
function bubbleSort(arr) {
    for (var i = 0; i &lt; arr.length - 1; i++) {
        for (var j = i + 1; j &lt; arr.length; j++) {
            if (arr[i] &gt; arr[j]) {
                var temp = arr[i];
                arr[i] = arr[j];
                arr[j] = temp;
            }
        }
    }
    return arr;
}

function bubbleSort(arr) {
    var len = arr.length;
    for (var i = 0; i &lt; len - 1; i++) {
        for (var j = 0; j &lt; len - 1 - i; j++) {
            if (arr[j] &gt; arr[j + 1]) {
                var temp = arr[j];
                arr[j] = arr[j + 1];
                arr[j + 1] = temp;
            }
        }
    }
    return arr;
}

// 32.遍历Dom树
// 给定页面上的DOM元素,将访问元素本身及其所有后代(不仅仅是它的直接子元素)
// 对于每个访问的元素，函数讲元素传递给提供的回调函数
function traverse(element, callback) {
    callback(element);
    var list = element.children;
    for (var i = 0; i &lt; list.length; i++) {
        traverse(list[i], callback);
    }
}

// 33.原生js封装ajax
function ajax(method, url, callback, data, flag) {
    var xhr;
    flag = flag || true;
    method = method.toUpperCase();

    if (window.XMLHttpRequest) {
        xhr = new XMLHttpRequest();
    } else {
        xhr = new ActiveXObject(&#39;Microsoft.XMLHttp&#39;);
    }

    xhr.onreadystatechange = function () {
        if (xhr.readyState == 4 &amp;&amp; xhr.status == 200) {
            console.log(2)
            callback(xhr.responseText);
        }
    }

    if (method == &#39;GET&#39;) {
        var date = new Date(),
            timer = date.getTime();
        xhr.open(&#39;GET&#39;, url + &#39;?&#39; + data + &#39;&amp;timer&#39; + timer, flag);
        xhr.send()
    } else if (method == &#39;POST&#39;) {
        xhr.open(&#39;POST&#39;, url, flag);
        xhr.setRequestHeader(&#39;Content-Type&#39;, &#39;application/x-www-form-urlencoded&#39;);
        xhr.send(data);
    }
}

// 34.异步加载script
function loadScript(url, callback) {
    var oscript = document.createElement(&#39;script&#39;);
    if (oscript.readyState) { // ie8及以下版本
        oscript.onreadystatechange = function () {
            if (oscript.readyState === &#39;complete&#39; || oscript.readyState === &#39;loaded&#39;) {
                callback();
            }
        }
    } else {
        oscript.onload = function () {
            callback()
        };
    }
    oscript.src = url;
    document.body.appendChild(oscript);
}

// 35.cookie管理
var cookie = {
    set: function (name, value, time) {
        document.cookie = name + &#39;=&#39; + value + &#39;; max-age=&#39; + time;
        return this;
    },
    remove: function (name) {
        return this.setCookie(name, &#39;&#39;, -1);
    },
    get: function (name, callback) {
        var allCookieArr = document.cookie.split(&#39;; &#39;);
        for (var i = 0; i &lt; allCookieArr.length; i++) {
            var itemCookieArr = allCookieArr[i].split(&#39;=&#39;);
            if (itemCookieArr[0] === name) {
                return itemCookieArr[1]
            }
        }
        return undefined;
    }
}

// 36.实现bind()方法
Function.prototype.myBind = function (target) {
    var target = target || window;
    var _args1 = [].slice.call(arguments, 1);
    var self = this;
    var temp = function () {};
    var F = function () {
        var _args2 = [].slice.call(arguments, 0);
        var parasArr = _args1.concat(_args2);
        return self.apply(this instanceof temp ? this : target, parasArr)
    }
    temp.prototype = self.prototype;
    F.prototype = new temp();
    return F;
}

// 37.实现call()方法
Function.prototype.myCall = function () {
    var ctx = arguments[0] || window;
    ctx.fn = this;
    var args = [];
    for (var i = 1; i &lt; arguments.length; i++) {
        args.push(arguments[i])
    }
    var result = ctx.fn(...args);
    delete ctx.fn;
    return result;
}

// 38.实现apply()方法
Function.prototype.myApply = function () {
    var ctx = arguments[0] || window;
    ctx.fn = this;
    if (!arguments[1]) {
        var result = ctx.fn();
        delete ctx.fn;
        return result;
    }
    var result = ctx.fn(...arguments[1]);
    delete ctx.fn;
    return result;
}

// 39.防抖
function debounce(handle, delay) {
    var timer = null;
    return function () {
        var _self = this,
            _args = arguments;
        clearTimeout(timer);
        timer = setTimeout(function () {
            handle.apply(_self, _args)
        }, delay)
    }
}

// 40.节流
function throttle(handler, wait) {
    var lastTime = 0;
    return function (e) {
        var nowTime = new Date().getTime();
        if (nowTime - lastTime &gt; wait) {
            handler.apply(this, arguments);
            lastTime = nowTime;
        }
    }
}

// 41.requestAnimFrame兼容性方法
window.requestAnimFrame = (function () {
    return window.requestAnimationFrame ||
        window.webkitRequestAnimationFrame ||
        window.mozRequestAnimationFrame ||
        function (callback) {
        window.setTimeout(callback, 1000 / 60);
    };
})();

// 42.cancelAnimFrame兼容性方法
window.cancelAnimFrame = (function () {
    return window.cancelAnimationFrame ||
        window.webkitCancelAnimationFrame ||
        window.mozCancelAnimationFrame ||
        function (id) {
        window.clearTimeout(id);
    };
})();

// 43.jsonp底层方法
function jsonp(url, callback) {
    var oscript = document.createElement(&#39;script&#39;);
    if (oscript.readyState) { // ie8及以下版本
        oscript.onreadystatechange = function () {
            if (oscript.readyState === &#39;complete&#39; || oscript.readyState === &#39;loaded&#39;) {
                callback();
            }
        }
    } else {
        oscript.onload = function () {
            callback()
        };
    }
    oscript.src = url;
    document.body.appendChild(oscript);
}

// 44.获取url上的参数
function getUrlParam(sUrl, sKey) {
    var result = {};
    sUrl.replace(/(\w+)=(\w+)(?=[&amp;|#])/g, function (ele, key, val) {
        if (!result[key]) {
            result[key] = val;
        } else {
            var temp = result[key];
            result[key] = [].concat(temp, val);
        }
    })
    if (!sKey) {
        return result;
    } else {
        return result[sKey] || &#39;&#39;;
    }
}

// 45.格式化时间
function formatDate(t, str) {
    var obj = {
        yyyy: t.getFullYear(),
        yy: (&quot;&quot; + t.getFullYear()).slice(-2),
        M: t.getMonth() + 1,
        MM: (&quot;0&quot; + (t.getMonth() + 1)).slice(-2),
        d: t.getDate(),
        dd: (&quot;0&quot; + t.getDate()).slice(-2),
        H: t.getHours(),
        HH: (&quot;0&quot; + t.getHours()).slice(-2),
        h: t.getHours() % 12,
        hh: (&quot;0&quot; + t.getHours() % 12).slice(-2),
        m: t.getMinutes(),
        mm: (&quot;0&quot; + t.getMinutes()).slice(-2),
        s: t.getSeconds(),
        ss: (&quot;0&quot; + t.getSeconds()).slice(-2),
        w: [&#39;日&#39;, &#39;一&#39;, &#39;二&#39;, &#39;三&#39;, &#39;四&#39;, &#39;五&#39;, &#39;六&#39;][t.getDay()]
    };
    return str.replace(/([a-z]+)/ig, function ($1) {
        return obj[$1]
    });
}

// 46.验证邮箱的正则表达式
function isAvailableEmail(sEmail) {
    var reg = /^([\w+\.])+@\w+([.]\w+)+$/
    return reg.test(sEmail)
}

// 47.函数柯里化
//是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数，并且返回接受余下的参数且返回结果的新函数的技术

function curryIt(fn) {
    var length = fn.length,
        args = [];
    var result = function (arg) {
        args.push(arg);
        length--;
        if (length &lt;= 0) {
            return fn.apply(this, args);
        } else {
            return result;
        }
    }

    return result;
}

// 48.大数相加
function sumBigNumber(a, b) {
    var res = &#39;&#39;, //结果
        temp = 0; //按位加的结果及进位
    a = a.split(&#39;&#39;);
    b = b.split(&#39;&#39;);
    while (a.length || b.length || temp) {
        //~~按位非 1.类型转换，转换成数字 2.~~undefined==0 
        temp += ~~a.pop() + ~~b.pop();
        res = (temp % 10) + res;
        temp = temp &gt; 9;
    }
    return res.replace(/^0+/, &#39;&#39;);
}

// 49.单例模式
function getSingle(func) {
    var result;
    return function () {
        if (!result) {
            result = new func(arguments);
        }
        return result;
    }
}
作者：mytheart 
原文：https://blog.csdn.net/weixin_42755677/article/details/93665475
</code></pre>

                        </mu-card-text>
                        <mu-divider></mu-divider>
                        <!-- <mu-card-actions>
                            <a :href="item.href" v-for="(item,index) in datas" :key="index">
                                <mu-button flat>
                                    <span class="items_b" v-if="index!=1">上一篇：{{item.title}}</span>
                                    <span class="items_b" v-if="index==1">下一篇：{{item.title}}</span>
                                </mu-button>
                            </a>
                        </mu-card-actions>
                        <mu-divider></mu-divider> -->
                        <mu-card-actions>
                            <mu-button flat class="primary" @click.native="like_click()">
                                <div class="like">
                                    <!-- 点赞 -->
                                </div>
                            </mu-button>
                            <mu-button flat @click.native="gift_click()">
                                <div class="gift">
                                    <!-- 打赏 -->
                                </div>
                            </mu-button>
                        </mu-card-actions>
                    </mu-card>
                    <mu-card>
                        <div id="SOHUCS">
                            <!-- 感谢畅言 -->
                        </div>
                    </mu-card>
                </section>
                <!-- 侧边 -->
                <aside>
                    <mu-container>
                        <mu-expansion-panel :expand="expands">
                            <div slot="header">标签</div>
                            <mu-button color="primary" v-for="(item,index) in tag" :key="item.Id" v-cloak>{{item.name}}</mu-button>
                        </mu-expansion-panel>
                        <mu-expansion-panel :expand="expands">
                            <div slot="header">爱尚博客小程序</div>
                            <img src="../../image/xcx.jpg" alt="爱尚博客小程序">
                        </mu-expansion-panel>
                        <mu-expansion-panel :expand="expands">
                            <div slot="header">最近更新</div>
                            <mu-list>
                                <mu-tooltip :content="set_tips(item.timer,1)" v-for="(item,index) in new_items" :key="item.Id"
                                    placement="top">
                                    <a :href="item.href" target="_blank">
                                        <mu-list-item button :ripple="false">
                                            <mu-list-item-action v-cloak>
                                                {{index+1}}
                                            </mu-list-item-action>
                                            <mu-list-item-title v-cloak>{{item.title}}</mu-list-item-title>
                                        </mu-list-item>
                                    </a>
                                </mu-tooltip>
                            </mu-list>
                        </mu-expansion-panel>
                        <mu-expansion-panel :expand="expands">
                            <div slot="header">查看最多</div>
                            <mu-list>
                                <mu-tooltip :content="set_tips(item.look_num)" v-for="(item,index) in hot_items" :key="item.Id"
                                    placement="top">
                                    <a :href="item.href" target="_blank">
                                        <mu-list-item button :ripple="false">
                                            <mu-list-item-action v-if="index <= 2">
                                                <mu-badge :content="index+1" color="secondary"></mu-badge>
                                            </mu-list-item-action>
                                            <mu-list-item-action v-if="index > 2">
                                                <mu-badge :content="index+1"></mu-badge>
                                            </mu-list-item-action>
                                            <mu-list-item-title v-cloak>{{item.title}}</mu-list-item-title>
                                        </mu-list-item>
                                    </a>
                                </mu-tooltip>
                            </mu-list>
                        </mu-expansion-panel>
                        <mu-expansion-panel :expand="expands">
                            <div slot="header">看个广告</div>
                            <mu-carousel transition="fade" v-if="ad_data">
                            <mu-carousel-item v-for="(item,index) in ad_data" :key="item.Id">
                                <a :href="item.href">
                                    <img :src="item.ad_img" :alt="item.name">
                                </a>
                            </mu-carousel-item>
                        </mu-carousel>
                        </mu-expansion-panel>
                    </mu-container>
                </aside>
                <!-- 侧边 -->
                <!-- 底部 -->
                <footer class="foot">
                    <div class="link">
                        友情链接：
                        <a :href="item.url" v-for="(item,index) in links" :key="item.Id" :title="item.beizhu" target="_blank">
                            <mu-button color="primary" flat v-cloak>{{item.name}}</mu-button>
                        </a>
                    </div>
                    <div class="footer_bm">
                        <p>
                            <a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=44011802000140&token=da834af7-3426-45c3-b0b6-437f55b4aa7d"
                                target="_blank" title="粤公网安备-44011802000140号"><img src="https://www.aijiumai.cn/image/beianbgs.png"
                                    alt="粤公网安备-44011802000140号" width="30px" height="30px"> 粤公网安备-44011802000140号</a>
                            &nbsp;
                            <a href="http://www.miitbeian.gov.cn/" target="_blank" title="粤ICP备15074775">粤ICP备15074775号-1</a>
                        </p>
                        <p>
                            © 爱尚博客 &nbsp;<a href="https://www.aijiumai.cn">www.aijiumai.cn</a> &nbsp;
                            <a href="../../sitemap.xml">网站地图</a>
                        </p>
                    </div>
                </footer>
                <!-- 底部 -->
            </article>
            <!-- 主体 -->
            <!-- 打赏 -->
            <mu-container v-if="openAlert">
                <mu-dialog title="支持一下下嘛?" width="450" max-width="80%" :esc-press-close="false" :overlay-close="false"
                    :open.sync="openAlert">
                    <img src="../../image/3q.png" alt="">
                    <mu-button slot="actions" flat color="primary" @click="closeAlertDialog">考虑一下</mu-button>
                    <mu-button slot="actions" flat color="primary" @click="closeAlertDialog">我不！</mu-button>
                </mu-dialog>
            </mu-container>
            <!-- 打赏 -->
            </div>
            </body>
            <script src="../../common/v.js"></script>
            <script src="../../common/a.js"></script>
            <script src="../../common/m.js"></script>
            <script src="../../common/highlight.pack.js"></script>
            <script src="../../assets/js/item.js"></script>
            </html>